<template>
	<view class="container home-pd">
		<view class="card">
			<uv-form labelPosition="left" ref="form" :model="params" :rules="rules">
				<uv-form-item label-width="200rpx" label="区域大仓" borderBottom>
					{{warehouse.relName||"--"}}
				</uv-form-item>
				<uv-form-item prop="totalCost" required label-width="200rpx" label="采购成本总价" borderBottom>
					<uv-input v-model="params.totalCost" placeholder="请输入采购成本总价" border="none" />
				</uv-form-item>
				<uv-form-item prop="quantity" required label-width="200rpx" label="采购数量" borderBottom>
					<uv-input v-model="params.quantity" placeholder="请输入采购数量" border="none" />/KG
				</uv-form-item>
				<uv-form-item label-width="200rpx" label="采购成本单价" borderBottom>
					{{unitPrice}}
				</uv-form-item>
				<uv-form-item class="column" label-width="200rpx" label="采购凭证" borderBottom>
					<uv-upload :fileList="fileList" multiple :maxCount="1" @afterRead="afterRead"
						@delete="deletePic"></uv-upload>
				</uv-form-item>
				<uv-form-item label-width="200rpx" label="采购说明">
					<uv-textarea v-model="params.purchaseDescription" placeholder="请输入采购说明" border="none" />
				</uv-form-item>
			</uv-form>
		</view>
		<view @click="submit" :class="{loading:loading}" class="button flex flex-justify-center flex-items-center">
			<uv-loading-icon color="#FFFFFF"   v-if="loading" />
			<view v-else>确认采购</view>
		</view>
	</view>
</template>

<script setup>
	import tools from '../../../../utils/tools';
	import {
		useAccountStore
	} from '@/store';
	import {
		create
	} from '@/api/goods.js';
	import {
		onLoad
	} from '@dcloudio/uni-app';
	const accountStore = useAccountStore();

	const {
		proxy
	} = getCurrentInstance();
	let fileList = ref([]);
	let item;
	let params = reactive({
		cwcId: "", //中央大仓id
		providerId: "", //供应商信息id
		quantity: "", //数量
		purchasePicUrl: "", //凭证
		purchaseDescription: "", //说明
		productListId: "", //商品id
		totalCost: ""
	});
	let rules = {
		"totalCost": {
			type: 'string',
			required: true,
			message: '总价不能为空',
			trigger: ['blur', 'change']
		},
		"quantity": {
			type: 'string',
			required: true,
			message: '数量不能为空',
			trigger: ['blur', 'change']
		}
	}
	// params.cwcId = uni.getStorageSync('Rel-Id');
	let warehouse = reactive(getWarehouse());
	params.cwcId = warehouse.relId; 
	let loading = ref(false);
	onLoad((option) => {
		item = JSON.parse(decodeURIComponent(option.item));
		console.log(item, 'item')
		if (item) {
			({
				id: params.productListId = "",
				providerId: params.providerId = ""
			} = item);
		}
	})
	let unitPrice = computed(() => {
		if (params.totalCost !== "" && params.quantity !== "") {
			return `${params.totalCost/params.quantity}元/KG`
		} else {
			return "请输入总价和数量"
		}
	})

	function getWarehouse() {
		let id =  uni.getStorageSync('Rel-Id');
		return (accountStore?.centralWarehouse?.userRelRespVOList || []).find(i => i.id ==id) || null;
	}

	function afterRead(event) {
		let filePath = event.file[0].url;
		tools.updateFile({
			filePath
		}).then(res => {
			fileList.value.push(res);
			params.purchasePicUrl = res.url;
		})
	}

	function deletePic(event) {
		fileList.value = [];
		params.purchasePicUrl = "";
	}

	async function submit() {
		if(loading.value) return;
		loading.value = true;
		await proxy.$refs.form.validate()
		await create(params).then(res => {
			if(res.code==0){
				uni.showToast({
					title:'操作成功',
					icon:'none'
				})
			}
		}).catch(err=>{});
		
		setTimeout(() => {
			uni.navigateBack()
		}, 1000)
		// console.log(params)
	}
</script>

<style lang="scss" scoped>
	:deep(.uv-form-item__body) {
		padding: 38rpx 0 !important;
	}

	.column {
		:deep(.uv-form-item__body) {
			flex-direction: column !important;
			padding: 24rpx 0 !important;
		}

		:deep(.uv-form-item__body__right) {
			margin-top: 24rpx;
		}
	}

	:deep(.uv-form-item__body__left__content__required) {
		right: 10rpx;
		left: inherit !important;
	}

	:deep(.uv-form-item__body__left__content__label) {
		font-weight: 400;
		font-size: 28rpx;
		color: #3C3F4D;
	}

	@import "index.scss";
</style>